<template>
  <div class="newsInfo_content">
    <h3 class="title">{{newsInfo.title}}</h3>
    <p>
      <span>发表时间：{{newsInfo.add_time | dateFilter}}</span>
      <span>点击：{{newsInfo.click}}</span>
    </p>
    <hr />
    <div class="content" v-html="newsInfo.content"></div>

    <!-- 评论组件 -->
    <!-- 父组件向子组件传值  通过属性 -->
    <comment :newsId="id"></comment>
  </div>
</template>

<script>
import comment from "../sub-component/Comment.vue";
export default {
  data() {
    return {
      newsInfo: {}
    };
  },
  methods: {
    async getnewsInfo() {
      const { data } = await this.$http.get("/api/getnew/" + this.id);
      if (data.status === 0) return (this.newsInfo = data.message[0]);
    }
  },
  created() {
    this.getnewsInfo();
  },
  props: ["id"],
  components: {
    comment
  }
};
</script>

<style scoped>
.newsInfo_content {
  padding: 3px;
}
.newsInfo_content .title {
  font-size: 15px;
  text-align: center;
  color: red;
  margin: 15px 0;
}
</style>